<div class="outer ag-theme-quartz">
    <div id="eLeftGrid" style="height: 100%;" class="inner-col" ondragover="gridDragOver(event)" ondrop="gridDrop(event,'left')"></div>

    <div class="inner-col factory-panel">
        <span id="eBin" ondragover="binDragOver(event)" ondrop="binDrop(event)" class="factory factory-bin">
            <i class="far fa-trash-alt"><span class="filename"> Trash - </span></i>
            Drop target to destroy row
        </span>
        <span draggable="true" ondragstart="dragStart(event,'Red')" class="factory factory-red">
            <i class="far fa-plus-square"><span class="filename"> Create - </span></i>
            Drag source for new red item
        </span>
        <span draggable="true" ondragstart="dragStart(event,'Green')" class="factory factory-green">
            <i class="far fa-plus-square"><span class="filename"> Create - </span></i>
            Drag source for new green item
        </span>
        <span draggable="true" ondragstart="dragStart(event,'Blue')" class="factory factory-blue">
            <i class="far fa-plus-square"><span class="filename"> Create - </span></i>
            Drag source for new blue item
        </span>
    </div>

    <div id="eRightGrid" style="height: 100%;" class="inner-col" ondragover="gridDragOver(event)" ondrop="gridDrop(event,'right')"></div>

</div>
